import { App } from "antd";
import { useState } from "react"
import { useDialog } from "./useDialog";

/**
 * props = {
 *  showTools: true, 是否显示工具栏
 *  tools: undefined, 工具栏内容
 *  isPage: true, 是否分页
 *  columns: [], 表头
 *  reload: api, 加载列表数据
 *  remove: delApi, 单个删除
 *  batchRemove: batchDelApi, 批量删除
 * }
 */
export const useTable = (props = {}) => {
    const { modal, message } = App.useApp();
    // 是否分页
    const isPage = false === props?.isPage ? false : true;
    // 是否显示工具栏
    const showTools = false === props?.showTools ? false : true;
    // 工具栏内容
    const tools = props?.tools;
    
    // 表头
    const [columns, setColumns] = useState(props?.columns || []);
    // 数据
    const [data, setData] = useState([]);
    // 多选数据
    const [selected, setSelected] = useState([]);
    const [selectedRows, setSelectedRows] = useState([]);
    // 查询参数
    const [query, setQuery] = useState({});
    // 分页参数
    const [pagination, setPagination] = useState({
        current: 1,
        size: 10,
        total: 0,
    });

    function getQuery(param) {
        if (!param) {
            return query;
        }
        if (param.data) {
            return param;
        }
        if (query.data) {
            return {
                ...query,
                data: param,
            }
        }
        return param;
    }

    function onReload(param, callback = undefined) {
        param = getQuery(param);
        setQuery(param);

        props?.reload(param).then(resp => {
            let result = resp?.data;
            if (typeof callback === 'function') {
                callback(result);
                return;
            }

            if (isPage) {
                setData(result?.records);
                setPagination({
                    current: result?.pageNo || 1,
                    size: result?.pageSize || 10,
                    total: result?.total || 0,
                });
            } else {
                setData(result || []);
            }
        });
    }

    function onRemove(param, msg = undefined, callback = undefined) {
        if (!param) {
            message.warning('请选择数据！');
            return;
        }

        modal.confirm({
            title: '确认删除',
            content: msg || '确定要删除这条数据吗？',
            okText: '确认',
            cancelText: '取消',
            onOk: () => {
                props?.remove(param).then(resp => {
                    if (resp?.data) {
                        message.success('删除成功');
                        typeof callback === 'function' ? callback(query) : onReload();
                    } else {
                        message.error(resp?.msg || '删除失败');
                    }
                });
            }
        });
    }

    function onBatchRemove(param, msg = undefined, callback = undefined) {
        if (!param || !Array.isArray(param) || param.length == 0) {
            message.warning('请选择数据！');
            return;
        }

        modal.confirm({
            title: '确认删除',
            content: msg || '确定要删除这些数据吗？',
            okText: '确认',
            cancelText: '取消',
            onOk: () => {
                props?.batchRemove(param).then(resp => {
                    if (resp?.data) {
                        message.success('删除成功');
                        typeof callback === 'function' ? callback(query) : onReload();
                    } else {
                        message.error(resp?.msg || '删除失败');
                    }
                });
            }
        });
    }

    function resetData(data = undefined, page = undefined, columns = undefined) {
        setData(data || []);
        page && setPagination(page);
        columns && setColumns(columns);
    }

    function resetSelected(keys, rows = []) {
        setSelected(keys);
        setSelectedRows(rows);
    }

    return {
        data,
        isPage,
        columns,
        selected,
        selectedRows,
        pagination,
        showTools,
        tools,
        onReload,
        onRemove,
        onBatchRemove,
        resetData,
        resetSelected,
    };
}

export const useTableDialog = (props = {}) => {
    const dialog = useDialog(props);
    const table = useTable(props);

    return {
        ...dialog,
        ...table,
    };
}
